<template>
    <div class="test_wow">
        <section class="wow bounceInDown test_wow" data-wow-duration="1s">
        </section>
        <section class="wow bounceInDown test_wow1" data-wow-duration="2s">
        </section>
        <section class="wow bounceInDown test_wow2" data-wow-duration="1s">
        </section>
        <section class="wow bounceInDown test_wow3" data-wow-duration="2s">
        </section>
        <section class="wow bounceInDown test_wow4" data-wow-duration="1s">
        </section>
        <section class="wow bounceInDown test_wow" data-wow-duration="2s">
        </section>
    </div>

</template>

<script>
    export default {
        name: 'Home',
        data() {
            return {

            }
        },
        mounted() {
            new this.$wow.WOW().init()
        }
    }

</script>

<style scoped>
    .test_wow {
        position: relative;
        width: 1000px;
        height: 400px;
        background: #212121;
        margin: 0 auto;
    }

    .test_wow1 {
        position: relative;
        width: 1000px;
        height: 400px;
        background: #741919;
        margin: 0 auto;
    }

    .test_wow2 {
        position: relative;
        width: 1000px;
        height: 400px;
        background: #2b0f44;
        margin: 0 auto;
    }

    .test_wow3 {
        position: relative;
        width: 1000px;
        height: 400px;
        background: #558614;
        margin: 0 auto;
    }

    .test_wow4 {
        position: relative;
        width: 1000px;
        height: 400px;
        background: #440707;
        margin: 0 auto;
    }
</style>